<template >
  <div>
    <main class="container">
      <div class="tip" style="margin-bottom: 0rem">
        <div class="return el-icon-arrow-left" @click="$router.go(-1)"></div>
        <div class="title">{{agreementName}}</div>
        <div></div>
      </div>
      <div class="content" v-html="agreementContent" style="padding: 0rem 0.9333rem"></div>
    </main>
  </div>
</template>

<script>
import { getDocRichTextApi } from "@/BMViews/api/InvitedUsers.js";
export default {
  props: {},
  data() {
    return {
      agreementName:'',//当前是什么协议
      agreementContent: "",
    };
  },
  mounted() {
    this.getAgreementFn();
    // 路由传参
    if (this.$route.query.type) {
      let type = this.$route.query.type
      if(type=='serve'){
        this.agreementName = '用户协议'
      }else{
        this.agreementName = '隐私协议'
      }
    }
  },
  methods: {
    // 搜索协议
    async getAgreementFn() {
      let type = this.$route.query.type;
      let typeId = "";
      function is_Android() {
        // 类型 1 专家宝典 2 商务宝典 3 ios隐私协议 4 ios用户协议 5 pc隐私协议 6 pc用户协议 7 安卓隐私协议 8 安卓用户协议 9 小程序隐私协议 10 小程序用户协议 11免责声明 12购买须知 13认证说明
        // 判断手机机型
        var u = navigator.userAgent;
        if (u.indexOf("Android") > -1 || u.indexOf("Linux") > -1) {
          // 如果为serve是服务协议
          type == "serve" ? (typeId = "服务协议") : (typeId = 7);
          //安卓手机
        } else if (u.indexOf("iPhone") > -1) {
          // 如果为serve是服务协议
          type == "serve" ? (typeId = "服务协议") : (typeId = 3);
          //苹果手机
        }
        // return typeId;
      }
      if(type=='serve'){
        typeId = 6 //用户协议
      }else{
        typeId = 5 //隐私协议
      }

      let { code, data } = await getDocRichTextApi({ typeId });
      if (code != 200) return;
      this.isClickAgreetment = true;
      this.agreementContent = data.rows[0]?.content;
    },
  },
};
</script>
<style scoped lang="scss">
main.container {
  position: relative;
  background: url("./assets/images/dt_img.png");

  min-height: 43.3067rem;
  div.tip {
    padding: 0.5333rem 0.8rem 0rem;
    display: flex;
    justify-content: space-between;
    font-size: 1rem;
    font-family: PingFang SC;
    font-weight: 600;
    color: #333333;
    margin-bottom: 2.3733rem;
    div{
      min-width: 16px;
    }
    div.return {
    }

    div.title {
    }

    div.more {
    }
  }

  .content{
    font-size: 0.9rem;
    line-height: 1.4rem;
    color: #333;
  }

  div.login-box {
    text-align: center;
    margin: 0 auto;
    padding-top: 2.3733rem;
    div.login {
      img {
        width: 3.2rem;
        height: 3.2rem;
        margin-bottom: 1.7333rem;
      }
    }

    div.login-tip {
      font-size: 0.7467rem;
      font-family: PingFang SC;
      font-weight: 400;
      color: #333333;
    }

    div.login-titile {
      margin-top: 1.3067rem;
      font-size: 1.2267rem;
      font-family: PingFang SC;
      font-weight: 600;
      color: #333333;
    }
  }

  div.input-box {
    margin-top: 2.24rem;
    text-align: center;
    div.input-item {
      margin-top: 1.0667rem;
      input {
        padding-left: 0.5333rem;
        width: 17.3333rem;
        font-size: 0.8rem;
        font-family: PingFang SC;
        font-weight: 400;

        display: inline-block;
        height: 2.4rem;
        background: #ffffff;
        border: 0.0267rem solid #cccccc;
        border-radius: 1.2rem;
      }
      input.name {
      }
    }

    div.input-item.haveVerify {
      border: 0.0267rem solid #cccccc;
      height: 2.4rem;
      background: #ffffff;
      border: 0.0267rem solid #cccccc;
      border-radius: 1.2rem;
      display: flex;
      width: 17.3333rem;
      margin: 1.0667rem auto;
      align-items: center;
      input {
        flex: 1;
        height: 2.2133rem;

        border: unset;
      }

      span.verify {
        flex: 0.5;
        height: 0.8rem;
        text-align: center;
        line-height: 0.8rem;
        font-size: 0.8rem;
        font-family: PingFang SC;
        font-weight: 400;
        color: #f77a23;
        border-left: #cccccc solid 0.0267rem;
      }
    }
  }
  .registerBtn {
    margin: 1.0667rem auto;

    line-height: 2.4rem;
    width: 17.3333rem;
    height: 2.4rem;
    font-size: 0.8533rem;
    font-family: PingFang SC;
    font-weight: 600;
    color: #ffffff;
    background: #f77a23;
    border-radius: 1.2rem;
    width: 17.3333rem;
    height: 2.4rem;
    background: #f77a23;
    border-radius: 1.2rem;
  }
  div.agreement {
    font-size: 0.5867rem;
    font-family: PingFang SC;
    font-weight: 400;
    color: #999999;
    left: 50%;
    width: 100%;
    text-align: center;
    transform: translate(-50%);
    position: absolute;
    bottom: 0.5333rem;
    span.serve {
      cursor: pointer;
    }

    span.privacy {
      cursor: pointer;
    }
  }
}
input:focus-visible {
  outline-offset: unset;
}
:focus-visible {
  outline: unset;
}
</style>